<template>
    <div class="app-container">
        <!-- 添加权限 -->
        <el-form ref="form" :model="pageInfo" :rules="rules"  label-width="80px">
            <el-form-item label="权限名称" prop="permissionName">
                <el-input v-model="pageInfo.permissionName" placeholder="请输入权限名称" />
            </el-form-item>
            <el-form-item label="权限标识" prop="permissionCode">
                <el-input v-model="pageInfo.permissionCode" placeholder="请输入权限标识" />
            </el-form-item>
            <el-form-item label="备注" prop="remark">
                <el-input v-model="pageInfo.remark" />
            </el-form-item>
            <el-form-item label="页面Key" prop="page" v-if="false">
                <el-input v-model="pageInfo.page" />
            </el-form-item>
            <el-form-item label="页面编码" prop="pageCode" v-if="false"  >
                <el-input v-model="pageInfo.pageCode" />
            </el-form-item>
            <el-form-item label="Id" prop="id" v-if="false"  >
                <el-input v-model="pageInfo.id" />
            </el-form-item>
        </el-form>
        <div class="dialog-footer" style="float:right">
            <el-button :loading="buttonLoading" type="primary" @click="submitForm">保 存</el-button>
            <el-button @click="cancel">取 消</el-button>
        </div>
    </div>
</template>

<script>
    import { addPageButtonPermission, editPageButtonPermission } from '@/api/platform/buttonPermission'
    export default {
        name: "permissionForm",
        props: {
            // 页面权限信息
            pageInfo: Object,
        },
        data() {
            return {
                // 按钮loading
                buttonLoading: false,
                // 表单校验
                rules: {
                    permissionName: [
                        { required: true, message: "权限名称不能为空", trigger: "blur" }
                    ],
                    permissionCode: [
                        { required: true, message: "权限标识不能为空", trigger: "blur" }
                    ]
                },


            }
        },
        methods: {
            // 给页面添加权限数据
            submitForm() {
                console.log('pageInfo===:', JSON.stringify(this.pageInfo))
                this.$refs["form"].validate(valid => {
                    if (valid) {
                        this.buttonLoading = true;
                        if (this.pageInfo.id != null) {
                            editPageButtonPermission({
                                'id': this.pageInfo.id,
                                'page': this.pageInfo.page,
                                'permissionName': this.pageInfo.permissionName,
                                'permissionCode': this.pageInfo.permissionCode,
                                'remark': this.pageInfo.remark
                            }).then(res => {
                                if (res.retCode === '200') {
                                    this.$message.success('修改成功')
                                    this.cancel();
                                    // 重新加载
                                    this.$emit("submitForm");
                                } else {
                                    this.$message.error('修改失败...')
                                }
                            }).finally(() => {
                                this.buttonLoading = false;
                            });
                        } else {
                            addPageButtonPermission([
                                {
                                    'permissionName': this.pageInfo.permissionName,
                                    'pageCode': this.pageInfo.pageCode,
                                    'page': this.pageInfo.page,
                                    'permissionCode': this.pageInfo.permissionCode,
                                    'remark': this.pageInfo.remark
                                }
                            ]).then(res => {
                                if (res.retCode === '200') {
                                    if (res.responseBody !== 0) {
                                        this.$message.success('提交成功')
                                        this.cancel();
                                        // 重新加载
                                        this.$emit("submitForm");
                                    } else {
                                        this.$message.error('按钮权限已存在！');
                                    }
                                } else {
                                    this.$message.error('提交失败...')

                                }
                            }).finally(() => {
                                this.buttonLoading = false;
                            });
                        }



                    }
                });

            },
            // 取消按钮
            cancel() {
                // 清空
                this.$emit("cancelDialog");
            },
        }

    }

</script>
